<template>

  <el-date-picker
    v-model="queryTime"
    :size="size"
    type="daterange"
    align="right"
    unlink-panels
    value-format="yyyy-MM-dd"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    :picker-options="pickerOptions"
    style="width: 260px"
    :clearable="false"
  >
  </el-date-picker>

</template>

<script>
import { dateToStr, getHistoryStrTime } from '@/libs/datetime'

export default {
  props: {
    size: {
      type: String,
      default: 'small'
    },
    orgQueryTime: {
      type: Array,
      default() {
        return [getHistoryStrTime(dateToStr(new Date()), 30), getHistoryStrTime(dateToStr(new Date()), 1)]
      }
    }
  },
  data() {
    return {
      queryTime: this.orgQueryTime,
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > new Date().getTime() - 3600 * 1000 * 24
        },
        firstDayOfWeek: 1,
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近半个月',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 15)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近二个月',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 60)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近四个月',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 120)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近半年',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 180)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一年',
          onClick(picker) {
            const end = new Date()
            end.setTime(end.getTime() - 3600 * 1000 * 24)
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 360)
            picker.$emit('pick', [start, end])
          }
        }]
      }
    }
  },
  computed: {

  },
  watch: {
    queryTime() {
      this.$emit('child-time', this.queryTime)
    }
  },
  mounted() {
    // this.$emit('child-time', this.queryTime)
  },
  methods: {
    setChildTimeRange(data) {
      this.queryTime = data
    }
  }

}
</script>

